<template>
	<div id="tmpl">
		
		<div id="desc">
			<div class="title">
				<h4>{{photoinfo.title}}</h4>
				<p>发表时间：{{photoinfo.add_time|datefmt("Y-M-D H:m:")}}　　浏览次数：{{photoinfo.click}}</p>
				<hr/>
			</div>
			<div class="mui-content">
				<ul class="mui-table-view mui-grid-view mui-grid-9">
					<li  class="mui-table-view-cell mui-media mui-col-xs-4 mui-col-sm-3" v-for="(item,index) in list">
						<img class="preview-img"  :src="item.src" height="100" @click="$preview.open(index,list)">
					</li>
				</ul>
				<p v-html="photoinfo.content"></p>
			</div>
		</div>
		<div id="comment">
			<comment :id="id"></comment>
		</div>
		
	</div>
</template>
<script>
import comment from '../subcom/comment.vue';
import common from '../../kits/common.js';
import {Toast} from 'mint-ui';
	export default{
		components:{
			comment
		},
		data(){
			return{
				id:0,
				photoinfo:[],
				list:[]
			}
		},
		created(){
			this.id=this.$route.params.id;
			this.getinfo();
			this.getimgs();
		},
		methods:{
			getinfo(){
				var url=common.apidomain+'/api/getimageInfo/'+this.id;
				this.$http.get(url).then(function(response){
						var data = response.body;
						if (data.status!=0) {
							Toast(data.message);
							return;
						}
						this.photoinfo=data.message[0];
					})
			},
			getimgs(){
				var url=common.apidomain+'/api/getthumimages/'+this.id;
				this.$http.get(url).then(function(response){
						var data = response.body;
						if (data.status!=0) {
							Toast(data.message);
							return;
						}
						data.message.forEach(function(item){
							var img=document.createElement('img');
							img.src=item.src;
							item.w = img.width;
							item.h = img.height;
						})
						this.list=data.message;
					})
			}
		}
	}
</script>
<style scoped>
	
</style>